the clear property

there are 5 types of clear : none, left, right, both, inherit

without clear

sharad khare div1
Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam, temporibus. Laudantium debitis veniam error, voluptatibus reprehenderit fuga temporibus consequuntur, a autem ullam officiis vitae perspiciatis blanditiis quia voluptatem, necessitatibus earum?


with clear

sharad khare div3
Lorem ipsum dolor sit amet consectetur adipisicing elit. Fugit recusandae incidunt voluptatum repellat, at atque sunt esse magni pariatur! Incidunt sapiente quo dolores maxime, consequatur obcaecati labore accusamus saepe error?

the clearfix hack

without clearfix

Lorem ipsum, dolor sit amet consectetur adipisicing elit. Qui nobis in unde sapiente deleniti sunt illum porro, incidunt harum maiores adipisci omnis cupiditate fuga sed quam, accusamus rerum ipsa at!

Lorem ipsum dolor sit amet consectetur adipisicing elit. Saepe qui cumque, magnam nesciunt accusamus repellat molestiae ratione doloremque dolorum odio exercitationem ab recusandae nam repudiandae in quae laboriosam. Officiis, accusantium?. Lorem ipsum dolor sit amet consectetur adipisicing elit. Odio at accusantium velit praesentium doloribus est asperiores qui, numquam eum tenetur neque dolores et nobis repellat libero nisi, iusto perferendis error.

with clearfix

Lorem ipsum dolor sit amet consectetur, adipisicing elit. Laborum aliquam explicabo natus quia officia ullam, sequi cupiditate? Vero maxime nam eius soluta corrupti dicta ipsa, dolores debitis dolore aut ad.

Lorem ipsum dolor sit amet consectetur, adipisicing elit. Obcaecati ipsam autem, suscipit illum, dolorum amet impedit, voluptatum voluptate accusantium nesciunt aut? Quod, voluptatem inventore officia aperiam laboriosam vero sit harum. Lorem ipsum dolor sit amet consectetur adipisicing elit. Beatae dignissimos voluptates veniam fugit ut! Doloremque quas voluptate a modi quae placeat voluptates ab soluta iusto, architecto cupiditate velit, omnis quos?

with clearfix with overflow

Lorem ipsum dolor sit amet consectetur, adipisicing elit. Laborum aliquam explicabo natus quia officia ullam, sequi cupiditate? Vero maxime nam eius soluta corrupti dicta ipsa, dolores debitis dolore aut ad.

Lorem ipsum dolor sit amet consectetur, adipisicing elit. Obcaecati ipsam autem, suscipit illum, dolorum amet impedit, voluptatum voluptate accusantium nesciunt aut? Quod, voluptatem inventore officia aperiam laboriosam vero sit harum. Lorem ipsum dolor sit amet consectetur adipisicing elit. Beatae dignissimos voluptates veniam fugit ut! Doloremque quas voluptate a modi quae placeat voluptates ab soluta iusto, architecto cupiditate velit, omnis quos?